<template>
  <div class="Driverfiledetails">
    <mt-cell :title="title"></mt-cell>
    <mt-cell title="设备编号:" :value="dataForm.facilitiesNo"></mt-cell>
    <mt-cell title="设备钢号:" :value="dataForm.facilitiesSteel"></mt-cell>
    <mt-cell title="设备名称:" :value="dataForm.facilitiesName"></mt-cell>
    <mt-cell title="准入时间:" :value="dataForm.admittanceDate"></mt-cell>
    <mt-cell title="设备颜色:" :value="dataForm.facilitiesColour"></mt-cell>
    <mt-cell title="使用年限:" :value="dataForm.serviceLife"></mt-cell>
    <mt-cell title="产权归属:" :value="dataForm.facilitiesDept"></mt-cell>
    <mt-cell title="联系电话:" :value="dataForm.telephone"></mt-cell>
    <mt-cell title="设备类型:" :value="dataForm.facilitiesTypeName"></mt-cell>
    <mt-cell title="厂牌型号:" :value="dataForm.brandModel"></mt-cell>
    <mt-cell title="设备钢号:" :value="dataForm.facilitiesSteel"></mt-cell>
    <mt-cell title="出厂日期:" :value="dataForm.dateOfProduction"></mt-cell>
    <mt-cell title="状态:" :value="dataForm.stateName"></mt-cell>
    <mt-cell title="图片:"></mt-cell>
    <mt-cell class="pickBlock">
      <img :src="item.url" alt class="imgW_30" v-for="item in imgurl" :key="item.key">
    </mt-cell>
    <mt-cell title="备注:" :value="dataForm.reames"></mt-cell>
  </div>
</template>

<script>
import { mapState, mapMutations } from "vuex";
export default {
  data() {
    return {
      data: "",
      dataForm: [],
      title: "",
      title: "档案详情",
      imgurl: [
        {
          key:1,
          url:
            "http://62.234.223.249:7777/group1/M00/00/07/rBUQDlx2W3mAZ5pEAAC3VXotLqs996.jpg"
        },
        {
          key:2,
          url:
            "http://62.234.223.249:7777/group1/M00/00/07/rBUQDlx2W3mAZ5pEAAC3VXotLqs996.jpg"
        },
        {
          key:3,
          url:
            "http://62.234.223.249:7777/group1/M00/00/07/rBUQDlx2W3mAZ5pEAAC3VXotLqs996.jpg"
        },
        {
          key:4,
          url:
            "http://62.234.223.249:7777/group1/M00/00/07/rBUQDlx2W3mAZ5pEAAC3VXotLqs996.jpg"
        },
      ]
    };
  },
  components: {},
  created() {},
  computed: {},
  mounted() {
    this.DataIndex();
    this.$store.commit("SET_USER_INFO", "无动力设备档案详情");
  },
  watch: {},
  methods: {
    DataIndex: function() {
      this.$store.dispatch("NopowerIndex", this.$route.query.id).then(data => {
        this.dataForm = data;
      });
    }
  }
};
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scpoed>
.Driverfiledetails {
  position: fixed;
  top: 0.7rem;
  left: 0;
  overflow-y: scroll;
  width: 100%;
  height: auto;
  -webkit-overflow-scrolling: touch; /*这句是为了滑动更顺畅*/
  bottom: 0;
}
.Driverfiledetails .mint-cell-title {
  text-align: left;
}
.imgW_30 {
  width: 33%;
  float: left;
}

.pickBlock .mint-cell-value{
  display: block;
  
}
</style>
